<template>
	<view class="content">
		<a-demo title="基础使用">
			<view class="row">
				<pure-loading></pure-loading>
			</view>
		</a-demo>

		<a-demo title="提示文本">
			<view class="row">
				<pure-loading text="加载中..."></pure-loading>
			</view>
		</a-demo>

		<a-demo title="自定义图标">
			<view class="row">
				<pure-loading icon="__shuaxin" text="加载中..."></pure-loading>
			</view>
			<view class="row">
				<pure-loading icon="/static/icons/loading.png" text="加载中..."></pure-loading>
			</view>
		</a-demo>

		<a-demo title="纵向布局">
			<view class="row">
				<pure-loading text="努力加载中" class="pure-loading-column"></pure-loading>
			</view>
		</a-demo>
	</view>
</template>

<script setup>
</script>

<style scoped>
.row {
	box-sizing: border-box;
	padding: 15px;
	background: var(--pure-background-element);
	margin: 10px 0;
	border-radius: 4px;
}
</style>
